<template>
	<view>
		<div class="top-bg">
		</div>

		<l-file ref="lFile" @up-success="onSuccess"></l-file>

		<u-action-sheet :list="optList" v-model="optShow" @click="opt"></u-action-sheet>

		<u-popup v-model="deleteShow" mode="center" border-radius="14" width="80%">
			<h2 style="margin: 20rpx;">确认删除？</h2>
			<h2 style="margin-bottom: 40rpx;"></h2>
			<p style="margin: 20rpx;">{{optFileName}}</p>
			<u-button type="primary" @click="deleteFile()" style="margin: 20rpx;">确认</u-button>
		</u-popup>

		<u-popup v-model="renameShow" mode="center" border-radius="14" width="80%">
			<h2 style="margin: 20rpx;">文件重命名</h2>
			<h2 style="margin-bottom: 40rpx;"></h2>
			<u-input v-model="newFileName" placeholder="新文件名" type="text" :border="true" style="margin: 20rpx;" />
			<u-button type="primary" @click="renameFile()" style="margin: 20rpx;">确认</u-button>
		</u-popup>

		<u-popup v-model="mkdirShow" mode="bottom" border-radius="14" height="600rpx">
			<h2 style="margin: 20rpx;">新建目录</h2>
			<h2 style="margin-bottom: 40rpx;"></h2>
			<u-input v-model="newPath" placeholder="目录名称" type="text" :border="true" style="margin: 20rpx;" />
			<u-button type="primary" @click="mkdir()" style="margin: 20rpx;">确认</u-button>
		</u-popup>

		<div style="margin: 20rpx;background-color: #FFFFFF;">
			<u-grid :col="1">
				<u-grid-item>
					<u-avatar :src="headImg" size="128"></u-avatar>
					<h3 style="margin-top: 20rpx;color: #000000; ">{{nickName}}</h3>
					<h2 style="margin-top: 20rpx;color: #2979ff; ">云存储空间</h2>
					<div style="margin-top: 20rpx;color: #82848a;font-weight: 600;">
						<div v-if="fileLen == 0">
							0 b / {{fileTopLen/1000000}} g
						</div>
						<div v-if="fileLen<1000 && fileLen>0">
							{{parseInt(fileLen)}} b / {{fileTopLen/1000000}} g
						</div>
						<div v-if="fileLen>1000 && fileLen<1000000">
							{{parseInt(fileLen/1000)}} kb / {{fileTopLen/1000000}} g
						</div>
						<div v-if="fileLen>1000000">
							{{parseInt(fileLen/1000000)}} mb / {{fileTopLen/1000000000}} g
						</div>
					</div>
					<div style="width: 90%;">
						<u-line-progress :show-percent="false" active-color="#2979ff" :percent="(fileLen/fileTopLen)*100"></u-line-progress>
					</div>
					<u-divider>共{{fileNum}}个文件</u-divider>
				</u-grid-item>
			</u-grid>
		</div>

		<u-card :show-head="false" style="margin: 20rpx;">
			<view slot="body">
				<u-row gutter="16">
					<u-col span="8">
						<u-input v-model="path" placeholder="/" type="text" :border="true"/>
					</u-col>
					<u-col span="4">
						<u-button throttle-time="1000" type="primary" size="medium" @click="getFileList()" style="width: 100%;">查看</u-button>
					</u-col>
				</u-row>
			</view>
		</u-card>

		<div style="margin: 20rpx;">
			<u-grid :col="2">
				<u-grid-item @click="onUpload()">
					<u-icon name="arrow-upward" :size="46"></u-icon>
					<view class="grid-text">上传文件</view>
				</u-grid-item>
				<u-grid-item @click="openMkdir()">
					<u-icon name="plus" :size="46"></u-icon>
					<view class="grid-text">新建目录</view>
				</u-grid-item>
			</u-grid>
		</div>

		<u-divider v-show="copyFilePath!=''" style="background-color: rgb(240, 240, 240);">已复制：{{copyFilePath}}</u-divider>
		<u-button type="info" style="margin: 20rpx;" @click="copyFile()" v-show="copyFilePath!=''">粘贴到当前目录</u-button>

		<u-card sub-title="本地保存路径：我的手机/lFile/_downloads/beFile" style="margin: 20rpx;">
			<view slot="body">
				<u-icon name="arrow-leftward" size="40" style="margin-bottom: 40rpx;" @click="backFile()"></u-icon>
				<div v-for="(item, index) in fileList" :key="index">
					<u-row gutter="16" style="margin-bottom: 60rpx;">
						<u-col span="1">
							<u-icon name="list" @click="openFileOpt(item)"></u-icon>
						</u-col>
						<u-col span="7">
							{{item.filePath.name}}
						</u-col>
						<u-col span="3" style="font-size: 24rpx;">
							<div v-if="item.length == 0">

							</div>
							<div v-if="item.length<1000 && item.length>0">
								{{parseInt(item.length)}} b
							</div>
							<div v-if="item.length>1000 && item.length<1000000">
								{{parseInt(item.length/1000)}} kb
							</div>
							<div v-if="item.length>1000000">
								{{parseInt(item.length/1000000)}} mb
							</div>
						</u-col>
						<u-col span="1">
							<u-icon name="download" @click="downloadFile(item.filePath.name)"
								v-show="!item.isDirectory"></u-icon>
							<u-icon name="arrow-right" @click="openFile(item.filePath.name)" v-show="item.isDirectory">
							</u-icon>
						</u-col>
					</u-row>
				</div>
			</view>
		</u-card>

		<u-tabbar v-model="current" :list="downList" :mid-button="false" :before-switch="beforeSwitch"></u-tabbar>
	</view>
</template>

<script src="./index.js">

</script>

<style src="./index.css">

</style>
